.settings-view {
    .packages {
        .search-container {
            margin-bottom: 0;

            .btn-group {
                margin: 0.25rem 0 0.25rem 1rem;

                .btn {
                    background: fade(@text-color, 5%);

                    &.selected {
                        background: @base-color;
                    }
                }
            }
        }
        .error-message {
            padding: 0;
        }
        .search-message, .featured-message {
            margin: 2rem 0 0;
        }
    }
    .package-card, .package-detail-view .package-card, .package-detail .package-card {
        padding: 1rem;
        border: none;
        border-radius: 0.125rem;
        background: lighten(@app-background-color, 5%);
        margin: 1rem 0;
        .z-depth-1;

        &:hover {
            background: lighten(@app-background-color, 5%);
        }
        .body .card-name, .body h4.card-name a:not(.button) {
            color: @text-color;
            font-size: 1.5rem;
            margin-bottom: 1rem;

            span {
                font-size: 0.8rem;
                margin-left: 0.5rem;
            }
            &:hover {
                text-decoration: none;
            }
        }
        .package-description {
            font-size: 0.8rem;
            margin-bottom: 2rem;
            display: block;
            color: @text-color;
        }
        .meta {
            .btn {
                box-shadow: none;
                background: none;

                &:hover {
                    background: darken(@app-background-color, 2.5%);
                    box-shadow: none;
                }
            }
        }
        .meta-user {
            line-height: 2.25rem;

            a.author {
                color: @text-color;
            }
            .avatar {
                border-radius: 50%;
                width: 2.25rem;
                height: 2.25rem;
                margin-right: 1rem;
            }
        }
        .stats {
            font-size: 0.75rem;

            .icon::before {
                font-size: 1rem;
                margin-right: 0.5rem;
            }
            .stats-item {
                + .stats-item {
                    margin-left: 1rem;
                }
            }
        }
        .package-message {
            margin-bottom: 1.5rem;
        }
        &.deprecated {
            background-color: @app-background-color;
            opacity: 0.75;
        }
        .meta-controls {
            .install-button, .uninstall-button {
                &.is-installing, &.is-uninstalling {
                    background-image: none;
                    -webkit-animation: none;

                    &::before {
                        -webkit-animation: spin 1s linear infinite;
                        content: '\f087';
                    }
                }
            }
        }
    }
    .row:last-child:not(:only-child) .package-card {
        margin-bottom: 0;
    }
    .package-detail-view, .package-detail {
        .table {
            margin: 3rem 0;
        }
        .text:not(.table), .link {
            float: left;
            margin: 0 1rem 0 0;
        }
        .link {
            color: @base-color;
        }
        .btn-wrap-group {
            clear: both;
            padding: 1.5rem 0;
            margin: 0 -0.5rem;

            .btn {
                margin: 0 0.5rem 1rem;
            }
        }
        .section.settings-panel {
            padding-top: 2rem;
            border: none;

            .control-group:not(:last-child) .controls .control-group:last-child {
                margin-bottom: 2.5rem;
                padding-bottom: 2rem;
                border-bottom: 1px solid fade(@text-color, 5%);
            }
        }
    }
    .package-readme {
        pre {
            background: darken(@app-background-color, 2.5%);
            color: @text-color;
            border-color: fade(@text-color, 5%);

            code {
                background: none;
            }
        }
    }
    .alert + .package-container {
        margin-top: 3rem;
    }
}
@-webkit-keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(359deg);
    }
}
